<template>
	<view class="content">
		<!-- 顶部导航栏组件 -->
		<QSNavbar :navbarItems="navbarItems_1" backgroundColor="#ffffff"></QSNavbar>
		<view>
			<!-- 轮播图 -->
			<div class="banner">
				<div class="uview-banner">
					<u-swiper :list="homeData.banner" keyName="smallimage" height="340rpx"></u-swiper>
				</div>
			</div>
			<!-- 金刚区 -->
			<div :class="[{ banner_disabled: homeData.banner_state == 0 }, 'peter']">
				<u-scroll-list :indicator="homeData.cate.length > 10">
					<Scroll-List :list="homeData.cate" />
				</u-scroll-list>
			</div>
			<!-- <div :class="[{ banner_disabled: homeData.banner_state == 0 }, 'peter']">
				<u-scroll-list :indicator="homeData.cts.length > 10">
					<Scroll-Lists :list="homeData.cts" />
				</u-scroll-list>
			</div> -->

			<!-- 通知公告 -->
			<view class="notice">
				<u-notice-bar :text="notice" bgColor="#fff" direction="column" color="#333333" @click="openNotice">
				</u-notice-bar>
			</view>

			<!-- 企业介绍 -->
			<!-- <enter-Prise :list="business_arr" /> -->
			<!-- 营销中心 -->
			<!-- <mar-Ket :list="baseList" :marketLeftImage='marketLeftImage'/> -->
			<!-- 热门推荐 -->
			<!-- <Po-Pular :childImages="activityRightImage" :activityLeftImage='activityLeftImage' /> -->
			<!-- 热门项目 -->
			<!-- <pro-Ject :filterTab="filterTab" /> -->
			<!-- 推荐场馆 -->
			<re-Commend :reCommendlist="reCommendlist" />
			<!-- 旗下场馆 -->
			<!-- <Affili-Ated :detaillist="detail.list" :detailstyle="detail.style" /> -->
			<!-- 行业资讯 -->
			<Inform-Ation :newsList="newsList" />
		</view>
		<!-- 底部导航组件 -->
	</view>
</template>

<script>
	const index = require("@/api/index/index.js");
	import QSNavbar from "@/components/QS-Navbar/QS-Navbar.vue";
	import goodsSwiper from "@/components/pyh-goodsSwiper/pyh-goodsSwiper.vue";
	import movableSwiper from '@/components/movable-swiper/movable-swiper.vue';
	import ScrollList from '../components/ScrollList.vue'
	import ScrollLists from '../components/ScrollLists.vue'
	import enterPrise from '../components/enterPrise.vue'
	import marKet from '../components/marKet.vue'
	import PoPular from '../components/PoPular.vue'
	import proJect from '../components/proJect.vue'
	import reCommend from '../components/reCommend.vue'
	import AffiliAted from '../components/AffiliAted.vue'
	import InformAtion from '../components/InformAtion.vue'

	export default {
		components: {
			QSNavbar,
			goodsSwiper,
			movableSwiper,
			ScrollList,
			enterPrise,
			marKet,
			PoPular,
			proJect,
			reCommend,
			AffiliAted,
			InformAtion,
			ScrollLists
		},
		data() {
			return {
				navbarItems_1: [{
					layout: "left",
					type: "text",
					text: "首页",
					width: 15,
					weight: "bold",
					color: "#000",
				}, ],
				notice_img: this.$https.assetsPath + "image30.png",
				homeData: {
					banner: [],
					cate: [{
							icon: this.$https.assetsPath + "image3.png",
							name: "门票购买",
							row_state: 0,
						},{
							icon: this.$https.assetsPath + "image6.png",
							name: "会员办卡",
							row_state: 0,
						},
						{
							icon: this.$https.assetsPath + "image8.png",
							name: "球场预订",
							row_state: 0,
						},
						
					],
					cts: [{
							icon: this.$https.assetsPath + "image6.png",
							name: "积分商城",
							row_state: 0,
						},
					]
				},
				notice: [], //轮播信息
				movHeight: '205rpx', //卡片高度
				detail: {
					style: 3,
					title: "",
					list: [{
						venue_name: "篮球场",
						open_time: "08:00-20:00",
						venue_thumb: this.$https.assetsPath + "image11.jpg",
					}, {
						venue_name: "羽毛球场",
						open_time: "08:00-20:00",
						venue_thumb: this.$https.assetsPath + "image11.jpg",
					}, {
						venue_name: "足球场",
						open_time: "08:00-20:00",
						venue_thumb: this.$https.assetsPath + "image11.jpg",
					}, {
						venue_name: "乒乓球",
						open_time: "08:00-20:00",
						venue_thumb: this.$https.assetsPath + "image11.jpg",
					}],
					tabList: [{
							icon: this.$https.assetsPath + "image31.png",
							id: 31,
							name: "篮球",
						},
						{
							icon: this.$https.assetsPath + "image32.png",
							id: 28,
							name: "羽毛球",
						},
						{
							icon: this.$https.assetsPath + "image33.png",
							id: 27,
							name: "游泳",
						},
						{
							icon: this.$https.assetsPath + "image34.png",
							id: 32,
							name: "网球",
						}
					], //图标菜单
					hiddenTab: false, //隐藏tab
				},
				//传入的数据示例
				lastDataList: [],
				reCommendlist: [{
						cover: this.$https.assetsPath + "image7.png",
						name: '太行羿文体',
						values: 5
					},
					{
						cover: this.$https.assetsPath + "image7.png",
						name: '太行羿文体',
						values: 5
					},
					{
						cover:this.$https.assetsPath + "image7.png",
						name: '太行羿文体',
						values: 5
					}
				],
				text1: [],
				address: {
					name: "",
					city: "",
					province: "",
				},
				// newsDemoImage: this.$https.assetsPath + "09d9c9e3c595db3dfd06919727d6db8ed9c771c5.png",
				// building: this.$https.assetsPath + "48c89be73bd5b5100d62d9e224efd88047b262fa.png",
				// config: {
				// 	autoplay: true,
				// 	interval: 1000,
				// 	multiple: 2.58,
				// },

				// more: this.$https.assetsPath + "66bd2432e846ed909c5773c2448c4e356fea5568.png",
				activityRightImage: [
					this.$https.assetsPath + "image4.png",
					this.$https.assetsPath + "image1.png",
				],
				activityLeftImage: this.$https.assetsPath + "huodonghzixun.png",
				baseList: [{
						name: this.$https.assetsPath + "image35.png",
						title: "领券中心",
					},
					{
						name: this.$https.assetsPath + "image36.png",
						title: "砍价助力",
					},
					{
						name: this.$https.assetsPath + "image37.png",
						title: "拼团抢购",
					},
					{
						name: this.$https.assetsPath + "image38.png",
						title: "幸运抽奖",
					},
				],
				marketLeftImage: this.$https.assetsPath + "image7.png",
				business_arr: [{
						image: this.$https.assetsPath + "image39.png",
						text: "场馆介绍",
					},
					{
						image: this.$https.assetsPath + "image40.png",
						text: "收费标准",
					},
					{
						image: this.$https.assetsPath + "image41.png",
						text: "地图导航",
					},
				],
				// src: "https://cdn.uviewui.com/uview/album/1.jpg",
				newsList: [{
					cover:this.$https.assetsPath + "image42.jpg",
					create_at: "266天前",
					id: 25,
					name: "梅西效应：球衣全球售罄，夺冠帖点赞量Ins史上第一",
					remark: "世界杯夺冠，全球都在为35岁的梅西欢呼，这位老将终于穿上了阿根廷国家队的三星球衣。",
					sender: "懒熊体育",
				}],
			};
		},
		computed: {
			filterTab() {
				if (this.detail.tabList.length > 5) {
					this.detail.hiddenTab = true;
				}
				if (this.detail.hiddenTab) {
					let data = this.detail.tabList.slice(0, 4);
					data.push({
						icon: this.$https.assetsPath + "image43.png",
						name: "更多",
						id: -1,
					});
					console.log(data)
					return data;
				} else {
					return this.detail.tabList;
				}
			},
		},
		onLoad() {
			const that = this;
			that.getLocation();
		},
		onShow() {
			this.token_is_ok() //验证用户token是否过期，用户是否封禁
			this.bannerlist()  // 轮播图接口
			this.newsindexlist() //轮播信息
			this.trendslist() //行业动态
		},

		methods: {
			// 验证用户token是否过期，用户是否封禁
			token_is_ok(){
				index.token_is_ok().then(res => {
					console.log(res,'1111')
					if (res.code == -1) {
						uni.removeStorageSync('token');
						uni.removeStorageSync('userInfo');
						wx.clearStorageSync()
						wx.clearStorage()
					}
				})
			},
			// 行业动态
			trendslist(){
				index.trendsindex({
						'status-EQ': 'normal',
						order: 'desc',
						sort: 'weigh',
						page: 1,
						limit: 3,
					}).then(res => {
					if (res.code == 1) {
						this.newsList = res.data.rows
					}
				})
			},
			openNotice() {
				uni.navigateTo({
					url: "/pages_other/notice/notice",
				});
			},
			// 轮播图接口
			bannerlist(){
				index.Banner({
						order: 'desc',
						sort: 'weigh',
						page: 1,
						limit: 10,
						'status-=': 'normal'
					}).then(res => {
					if (res.code == 1) {
						this.homeData.banner = res.data.rows
					}
				})
			},
			// 轮播信息
			newsindexlist(){
				index.newsindex({
						'stateswitch-EQ': 1,
						order: 'desc',
						sort: 'weigh',
						page: 1,
						limit: 10,
					}).then(res => {
					if (res.code == 1) {
						let row = res.data.rows
						this.notice= row.map(item => item.title);
					}
				})
			},
			async getLocation() {
				const [err, res] = await uni.getLocation({
					isHighAccuracy: true, // 开启地图精准定位
					type: "gcj02",
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	@import url("@/static/css/index/index.css");

	.adress {
		margin-right: 20rpx;
		font-size: 28rpx;
		white-space: nowrap;
		color: white;
	}

	.notice /deep/ .u-icon__img {
		width: 60rpx !important;
		height: 30rpx !important;
	}

	// 容器
	.scrollContainer {
		width: 95%;
		height: 194rpx;
		white-space: nowrap;
		margin-top: 18rpx;
	}

	// 容器项
	.scrollitem {
		display: inline-block;
		margin-left: 30rpx;
		height: 234rpx;
	}

	.scrollimage {
		width: 270rpx;
		height: 154rpx;
	}

	.recommandItemText {
		width: 270rpx;
		text-align: center;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}

	.EmptyData {
		text-align: center;
		margin-top: 50rpx;
	}

	.team {
		position: relative;
	}

	.section_8 {
		padding: 30rpx 20rpx 25rpx;
		background-color: rgb(255, 255, 255);
		box-shadow: 0px 0px 8.9rpx 1.1rpx rgba(0, 0, 0, 0.06);
		border-radius: 10rpx;
		height: 187rpx;
		width: 327rpx;
		position: relative;
	}

	.image_1 {
		width: 80rpx;
		height: 80rpx;
	}

	.image_3 {
		width: 20rpx;
		height: 20rpx;
	}

	.image_5 {
		width: 21rpx;
		height: 20rpx;
	}

	.text_25 {
		margin-left: 2rpx;
		margin-top: 17rpx;
		align-self: flex-start;
		color: rgb(190, 190, 190);
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 22rpx;
	}

	.group_12 {
		margin-right: 69rpx;
		align-self: center;
		float: right;
	}

	.group_14 {
		margin-top: 1rpx;
	}

	.text_22 {
		margin-bottom: 2rpx;
		color: rgb(51, 51, 51);
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 700;
		line-height: 23rpx;
	}

	.text-wrapper {
		margin-left: 10rpx;
	}

	.image_6 {
		margin-left: 8rpx;
	}

	.image_8 {
		margin-left: 7rpx;
	}

	.image_10 {
		margin-left: 8rpx;
	}

	.image_12 {
		margin-left: 7rpx;
	}

	.bblue {
		background-color: deepskyblue;
	}

	.ppink {
		background-color: rgb(239, 100, 132);
	}

	.view_9 {
		padding: 11rpx 0 1rpx;
		color: rgb(255, 255, 255);
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 700;
		line-height: 10rpx;

		border-radius: 5rpx;
		width: 29rpx;
		height: 37rpx;
		float: right;
	}

	/* 去除滚动条 */
	::-webkit-scrollbar {
		width: 0;
		height: 0;
		color: transparent;
		display: none;
	}

	.section_9 {
		margin-left: 20rpx;
		padding: 57rpx 0;
		color: rgb(51, 51, 51);
		font-size: 22rpx;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 21rpx;
		background-color: rgb(255, 255, 255);
		/* box-shadow: 0px 0px 8.9rpx 1.1rpx rgba(0, 0, 0, 0.06); */
		border-radius: 10rpx;
		width: 60rpx;
		height: 100%;
		position: absolute; //父元素的position位置固定，这个绝
	}
</style>